<style scoped lang="scss">

</style>
<template>
  <div>
    <template v-for="(item,i) in fields">
      <div v-if="item.config.type==='map'">

      </div>
      <starTemplateField v-else
                         :value="lodash.get(value,item.dataIndex)"
                         :labelStyle="labelStyle"
                         :label="!!item.label?item.label:item.dataIndex"
                         :tip="item.tip"
                         :config="item.config"
                         :addField="addField"
                         :removeField="removeField"
                         @change="change(item.dataIndex,$event)"
      ></starTemplateField>
    </template>

  </div>
</template>

<script>
export default {
  name: "starJsonObject",
  components: {},
  model: {
    prop: 'value',
    event: 'change'
  },
  data() {
    return {

    }
  },
  props: {
    value: {
      default: () => {
        return {
          abc:'abc',
          def:{
            www:'www'
          }
        }
      }
    },
    labelStyle: {
      default: () => {
        return {};
      }
    },
    checkable: {
      default: () => {
        return false;
      }
    },
    fields: {
      default: () => {
        return [];
      }
    },
    addField: {
      default: () => {
        return false;
      }
    },
    removeField: {
      default: () => {
        return false;
      }
    },
  },
  computed: {},
  beforeMount() {

  },
  mounted() {

  },
  watch: {

  },
  methods: {
    change(path,value,item){
      this.lodash.set(this.value,path,value);
      this.$emit('change',this.value);
      // if(this.checkable){
      //   if(item.show){
      //     this.lodash.set(this.value,path,value);
      //     this.$emit('change',this.value);
      //   }else{
      //     this.lodash.unset(this.value,path);
      //     this.$emit('change',this.value);
      //   }
      // }else{
      //   this.lodash.set(this.value,path,value);
      //   this.$emit('change',this.value);
      // }

    },
    check(path,value,item){
      if(this.checkable){
        if(item.show){
          // this.lodash.set(this.value,path,value);
          // this.$emit('change',this.value);
        }else{
          this.lodash.unset(this.value,path);
          this.$emit('change',this.value);
        }
      }
    }
  }
}
</script>
    